<template>
	<view class="aBox">
		<u-tabs :list="list1" @click="click"></u-tabs>
		<view v-if="current == 0">
			<ul>
				<li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian" @click="show = true">...</text>
					</view>
				</li>
				<li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li>
			</ul>
		</view>
		<view v-if="current == 1">
			<ul>
				<li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li>
				<li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li>
			</ul>
			</view>
		<view v-if="current == 2">
			<ul>
				<li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li>
				<li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li>
			</ul>
		</view>
		<view v-if="current == 3">
			<ul>
				<li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li>
				<li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li><li>
					<view class="wendang_list">
						<image src="../../../static/wendang.png" mode="" class="logoText"></image>
						<view class="wendnag_center">
							<text class="aka" @click="jumpFileName">文件夹名称</text>
							<text>赵小刚&nbsp;&nbsp;2019-08-22 12:00</text>
						</view>
						<text class="dian">...</text>
					</view>
				</li>
			</ul>
		</view>
		
		
		
		
		<u-popup :show="show" @close="close" @open="open">
		            <view class="alert">
		               <text class="alert_title">合同文件模板.xls</text>
					   <ul class="alert_btn">
						   <li @click="jumpChooseW">移动</li>
						   <li>共享</li>
						   <li>重命名</li>
						   <li @click="show1 = true">删除</li>
					   </ul>
		            </view>
				</u-popup>
		
		
		
		
		<u-popup :show="show1" @close="close" @open="open" mode="center">
		            <view class="alert">
		               <h2>删除确认</h2>
					   <text>确定删除文件夹吗</text>
					   <view class="btnBox">
						   <u-button type="primary" :plain="true" text="取消"  @click="closeS"></u-button>
						    <u-button type="primary" :plain="true" text="确定" @click="openS"></u-button>
					   </view>
		            </view>
				</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				show1: false,
				current:0,
				 list1: [{
				           name: '我的文档',
				                }, {
				                    name: '公共文档',
				                }, {
				                    name: '我共享的'
				                }, {
				                    name: '与我共享'
				                }]
			}
		},
		methods: {
			click(index) {
			 this.current = index.index
			},
			jumpFileName(){
				uni.navigateTo({
					url:"/pages/my/filename/filename"
				})
			},
			 open() {
          // console.log('open');
        },
        close() {
          this.show = false
          // console.log('close');
        },
		jumpChooseW(){
			uni.navigateTo({
				url:"/pages/my/choosewei/choosewei"
			})
		},
		closeS(){
			this.show1 = false
		},
		openS(){
			this.show1 = false
		}
		}
	}
</script>

<style>
	.aBox{
		background-color:rgba(242, 242, 242, 0.5);
	}
	li{
		background-color: white;
		margin-top: 3px;
	}
	.btnBox{
		display: flex;
	}
	.alert>text{
		line-height: 50px;
	}
	h2{
		font-weight: bold;
	}
	.alert_btn{
	display: flex;
	margin-top: 30px;
	}
	.alert_btn>li{
		width: 25vw;
		text-align: center;
	}
	.alert_title{
		font-size: 14px;
		color: #999999;
		height: 50px;
		line-height: 50px;
		width: 100vw;
		border-bottom: 1px solid grey;
	}
	.alert{
		width: 100vw;
		height: 150px;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.dian{
		font-size: 24px;
		color: #999999;
		margin-top: -20px;
	}
	.wendang_list{
		padding: 5px;
		/* border-bottom: 2px solid #cccccc; */
	}
	.wendnag_center{
		line-height: 25px;
	}
	.wendnag_center:nth-child(2){
		font-size: 12px;
		color: #cccccc;
	}
	.aka{
		font-size: 16px;
		color: dimgray;
		
	}
	.logoText{
		width: 29px;
		height: 29px;
	}
*{
	padding: 0;
	margin: 0;
	list-style-type: none;
}
.wendang_list{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.wendnag_center{
	display: flex;
	flex-direction: column;
}

</style>
